<template>
  <div :class="`tab-header`">
    <Tabs>
      <template v-for="item in achieveList" :key="item.key">
        <TabPane :tab="item.name">
          <a-alert
            type="warning"
            message="请勿在传输过程中关闭或刷新页面"
            style="margin-bottom: 7px"
            show-icon
          />
          <component :is="item.component" />
        </TabPane>
      </template>
    </Tabs>
  </div>
</template>
<script lang="ts">
  import { Tabs } from 'ant-design-vue';
  import { defineComponent } from 'vue';
  import { Alert } from 'ant-design-vue';

  import MyFile from './myfile/index.vue';
  export default defineComponent({
    components: {
      MyFile,
      Tabs,
      [Alert.name]: Alert,
      TabPane: Tabs.TabPane,
    },
    setup() {
      const achieveList: TabItem[] = [
        {
          key: '1',
          name: '我的文件',
          component: 'MyFile',
        },
      ];
      return {
        achieveList,
      };
    },
  });
</script>
<style lang="less" scoped>
  .tab-header {
    background: white;
    padding-left: 1%;
    padding-right: 1%;
  }
</style>
